正文：
這一週我們介紹了 vue component、vue cli 和 vue router，今天我們在一次的回顧這些東西吧

Vue Component：
當我們有著許多類似的功能會在同一個專案不同使用時，基本上能夠將同一份代碼匯出到不同頁面這種方法會比較易於維護，而 component 的作用就是在此，我們會將一個頁面拆成無數個組件，並且在組件中開放些接口提供客製化服務。
當我們創立好組件的時候，會在各個頁面透過局部註冊的方式使用，避免造成全域註冊後的重複問題，並且我們在這邊有介紹到<template>此標籤，此標籤不會被渲染，但可以在上面撰寫些邏輯指令，像是v-for v-if之類的來讓裡面的區域決定要不要渲染出來，下方舉一個例子

<template v-if="ironManData.length==0">
    <span>loading</span>
</template>
<tmeplate v-else>
    <div v-for="(item,index) in iron-man-data" :key="index">
        <p>{{item.title}}</p>
    </div>
</template>

這邊當我們的 ironManData 獲得資料時就會將每筆資料的 title 顯示出來，若 ironManData 沒資料時會顯示 loading

Vue Cli：
當我們創立一份新的 vue 專案時，我們很常會需要引用 webpack 去做專案管理，並且還會需要引用些常見套件，像是 CSS 預處理器，ESLint，babel...等等，那透過 vue-cli 可以迅速地完成此動作，當我們需要額外再添加 webpack loader 或 plugin 時再額外創建 vue.config.js 添加規則即可

Vue Router：
我們在第十二篇文章時有稍微介紹到 Vue Router 的一些使用方式，這邊個人認為在後續實戰時在介紹更深入的內容會比較適合，因此先介紹了如何在 vue router 添加路由，以及創建 <router-link>來進行路由操作，並且在router-view這邊渲染出來畫面。

嘮叨一下：
今天白天時注意到基隆有許多地方淹水，真不愧是雨都啊，希望各位基隆人可以平安順利